Ext.define('DragonApp.view.property.Form', {
    extend: 'Ext.form.Panel',

    alias: ['widget.propertyform'],

    title: '发道具及邮件',

    requires: [
        'DragonApp.view.pub.combobox.Server',
        'DragonApp.view.pub.combobox.Issue',
        'DragonApp.view.property.StatusBar',
        'DragonApp.store.PreviewProp',
        'Ext.form.field.Display',
        'DragonApp.util.Regular',
        'DragonApp.util.String',
        'DragonApp.util.Array',
        'DragonApp.util.Msg'
    ],

    bodyPadding: 5,

    fieldDefaults: {
        labelWidth: 60,
        labelAlign: 'right'
    },
    items: [{
            xtype: 'fieldcontainer',
            layout: 'hbox',
            items: [
                { xtype: "servercombobox", name: "serverid", fieldLabel: "服务器", width: 235, allowBlank: false },
                {
                    xtype: "issuecombobox",
                    name: "issuetype",
                    fieldLabel: "发放方式",
                    width: 235,
                    allowBlank: false,
                    listeners: {
                        'select': 'onIssueComboxSelect'
                    }
                },
                {
                    xtype: "textfield",
                    name: "id",
                    fieldLabel: "玩家ID",
                    emptyText: '多人请用英文逗号分隔',
                    width: 600,

                    listeners: {
                        'change': function(field, newValue, oldValue) {
                            var noempty = DragonApp.util.String.removeAllSpace(newValue);
                            var newFieldValue = noempty.replace(/[、，;；:：\|\\/]/g, ",");
                            field.setValue(newFieldValue);
                        }
                    },
                    validator: function(fieldValue) {

                        //空值不验证
                        if (Ext.isEmpty(fieldValue)) {
                            return true;
                        }
                        //空元素处理
                        var arr = fieldValue.split(',');

                        //重复判断
                        if (DragonApp.util.Array.repeatTest(arr)) {
                            return ('提示: ID字段存在重复元素');
                        }

                        //长度判断
                        for (var i = 0; i < arr.length; i++) {

                            if (7 != (String(arr[i])).length) {
                                return ('提示: ' + String(arr[i]) + ' ID字段长度不正确');
                            }

                            if (!DragonApp.util.Regular.Uid.test(arr[i])) {
                                return ('提示: ID字段格式 ' + String(arr[i]) + ' 不正确');
                            }
                        }

                        arr = arr.noEmpty();

                        this.setValue(arr.join(','));
                        return true;
                    }
                }
            ]
        },
        {
            xtype: "fieldcontainer",
            layout: "hbox",
            items: [
                { xtype: "textfield", name: "title", fieldLabel: "标题", allowBlank: false, maxLength: 8, enforceMaxLength: true, width: 470 },
                {
                    xtype: "textfield",
                    name: "nickname",
                    fieldLabel: "玩家名",
                    emptyText: '多人请用英文逗号分隔',
                    width: 600,

                    listeners: {
                        'change': function(field, newValue, oldValue) {

                            field.setValue(DragonApp.util.String.removeAllSpace(newValue));
                            //var newFieldValue = noemptyValue.replace(/[、，;；:：\|\\/]/g, ",");
                        },

                        'blur': function(field, event, eOpts) {
                            var fieldValue = field.getValue();
                            var arr = fieldValue.split(',');

                            arr = arr.noEmpty();

                            if (DragonApp.util.Array.repeatTest(arr)) {
                                DragonApp.util.Msg.showToast('提示: 玩家名字段存在重复元素');
                                return;
                            }
                            field.setValue(arr.join(','));
                        }
                    }
                }
            ]
        },
        {
            xtype: 'textarea',
            name: 'content',
            itemId: 'mailContent',
            fieldLabel: "内容",
            emptyText: "请输入..",
            anchor: '100%',
            height: 435,
            listeners: {
                change: 'onTextareaChange',
                delay: 100
            }
        },
        { xtype: "hiddenfield", name: "issuecontent", fieldLabel: "道具清单", allowBlank: true, width: 235 },
        {
            xtype: 'fieldcontainer',
            layout: 'hbox',
            items: [{
                xtype: 'displayfield',
                labelWidth: 160,
                fieldLabel: '中文字符数限制',
                name: 'maxLength',
                value: '99'
            }, {
                xtype: 'displayfield',
                labelWidth: 130,
                fieldLabel: '当前字符数',
                name: 'currrentLength',
                itemId: 'charCount',
                value: '0'
            }, {
                xtype: 'displayfield',
                labelWidth: 820,
                fieldLabel: '已选道具种类',
                name: 'propNum',
                value: '0'
            }]
        }
    ],

    buttons: [{
            text: '道具添加',
            itemId: 'addBtn',
            iconCls: 'x-fa fa-plus',
            toggleHandler: 'onToggleAttachment',
            enableToggle: true,
            tooltip: '添加/清除道具'
        },
        {
            text: '重置',
            itemId: 'resetBtn',
            iconCls: 'x-fa fa-undo',
            handler: function() {
                this.up('form').getForm().reset();
                var issueStore = Ext.data.StoreManager.lookup('selected_prop');
                issueStore.removeAll();
            }
        },
        {
            text: '预览',
            itemId: 'previewBtn',
            iconCls: 'x-fa fa-eye',
            handler: function() {

                var demoCode = '你知道<font>{text="窗", color="255,0,0", font_size=20}</font>';
                    demoCode += '<font>{text="窗", color="255,255,0", font_size=20}</font>';
                    demoCode += '之前明<br>月光吗？';

                    demoCode = Ext.String.htmlEncode(demoCode);

                var textArea = Ext.ComponentQuery.query('textarea', this.up('form'))[0];
                var parser = new CODE();

                var textAreaContent = parser.CodePrase(textArea.getValue());

                var win = Ext.create('Ext.window.Window', {

                    title: '预览',
                    modal: true,
                    width: 550,
                    height: 400,
                    resizable: false,
                    closeAction: 'destroy',
                    items: [{
                        xtype: 'tabpanel',
                        defaults: {
                            bodyPadding: 10,
                            scrollable: true
                        },
                        items: [{
                            tabConfig: {
                                title: '邮件内容',
                                tooltip: '邮件内容预览'
                            },
                            html: textAreaContent
                        }, {
                            tabConfig: {
                                title: '待发放道具',
                                tooltip: '已选道具预览'
                            },
                            items: [{
                                xtype: 'propertyselected',
                                itemId: 'previewgrid',
                                store: {
                                    type: 'previewprop',
                                    storeId: 'previewprop'
                                }
                            }]
                        }, {
                            tabConfig: {
                                title: '格式示范',
                                tooltip: '格式示范'
                            },
                            html: demoCode
                        }]
                    }]
                }).show();

                var preview_grid = Ext.ComponentQuery.query('propertyselected#previewgrid')[0];
                var store = preview_grid.getStore();
                var arr = JSON.parse(sessionStorage.getItem("issueRecord"));

                if(!Ext.isEmpty(arr)){

                    for (var i = 0; i < arr.length; i++) {
                        var item = arr[i];
                        var new_record = Ext.create('DragonApp.model.SelectedProp', {
                            id:     item.id,
                            name:   item.name,
                            num:    item.num
                        });
                        store.add(new_record);
                    }
                }

                var delete_column = preview_grid.queryById('delete');
                delete_column.hide();
            }
        },
        {
            text: '提交',
            itemId: 'submitBtn',
            iconCls: 'x-fa fa-check',
            handler: 'onSubmitClick'
        }
    ],

    listeners: {
        expand: 'onFormExpand',
        collapse: 'onFormCollapse'
    },

    textFieldChange: function(field, newValue, oldValue, eOpts) {
        field.setValue(DragonApp.util.String.removeAllSpace(newValue));
    }
});